var slider = document.getElementById("slider");
var current = 0;
function change() {
    var left = (current - 1 + slider.children.length) % slider.children.length;
    var right = (current + 1) % slider.children.length;
    Array.from(slider.children).forEach((Element, index) => {
        Element.className = "slider_item";
    })
    slider.children[left].className = "slider_item left";
    slider.children[current].className = "slider_item center";
    slider.children[right].className = "slider_item right";
    slider.children[left].children[1].className="bottom wrapper-none";
    slider.children[right].children[1].className="bottom wrapper-none";
    slider.children[current].children[1].className="bottom wrapper-block";
}

// var wrapper_startX = 0;
// var wrapper_moveX = 0;
// slider.addEventListener('touchstart',function(e){
//     wrapper_startX = e.targetTouches[0].pageX;

// })
// slider.addEventListener('touchmove',function(e){
//     wrapper_moveX= e.targetTouches[0].pageX - startX;
//     var translateX = this.translateX() +  wrapper_moveX;
   
// })


function next() {
    current = (current + 1) % slider.children.length;
    change();
}
function pre() {
    current = (current + slider.children.length - 1) % slider.children.length;
    change();
}
change();
